<template>
  <div>
    <!-- 头部 :title="$store.state.cityTitleData"-->
    <van-nav-bar left-arrow fixed z-index="999" @click-left="GoSearch" @click-right="Login" placeholder :border="false">
      <template #left>
        <van-icon name="search" size="22" />
      </template>
      <template #right>
        <div class="rightText">登录|注册</div>
      </template>
      <template #title>
        <div class="rightText ellipsis" @click="$router.push('/msite')">{{$store.state.cityTitleData}}</div>
      </template>
    </van-nav-bar>
    <!--首页导航-->
    <Swiper></Swiper>
    <!-- //elm.cangdu.org/img/164ad0b6a3917599.jpg -->
    <!-- 商家列表 -->
    <div class="shop_list_container">
      <header class="shop_header">
        <img src="@/assets/img/shangpu.svg" alt="">
        <span class="shop_header_title">附近商家</span>
      </header>
      <ShowList></ShowList>
    </div>
  </div>
</template>

<script>
import Swiper from '@/views/Home/Swiper/Swiper.vue'
import ShowList from '@/views/Home/ShowList/ShowList.vue'
export default {
  components: {
    Swiper,
    ShowList
  },
  data() {
    return {}
  },

  methods: {
    GoSearch() {
      this.$router.push('/search')
    },
    Login() {
      if (window.sessionStorage.getItem('user_id')) {
        this.$router.push('/user')
      } else {
        this.$router.push('/login')
      }
    }
  },
  mounted() {
    const geohash = window.sessionStorage.getItem('geohash')
    // dispatch 是用来触发actions 触发食品分类列表
    this.$store.dispatch('getFoodList')
    this.$store.dispatch('getohash', geohash)
  }
}
</script>

<style lang="less"scoped>
.rightText {
  color: #fff;
}
</style> 
